<extend name="Public/usercenter1"/>

<block name="style">
    <link href="__STATIC__/datetimepickerV3/css/bootstrap-datetimepicker.min.css" rel="stylesheet" type="text/css">
</block>

<block name="body">
<div class="uc_config_info common_block_border clearfix col-xs-12 mt_0"
     style="padding-top:20px;padding-bottom: 20px;">
    <div style="padding: 10px 30px;color: #959595;border-bottom: 1px dashed #959595">
        <div>
            <p class="MsoNormal">
                认证说明：<span><br />
</span>一起拍片网目前有两种不同的认证标识，一种是针对于在校的文化艺术类学生；一种是针对于在职的文化艺术类工作者。所有认证用户都可以获得免费的展示和推荐，并有机会获得更多的商业活动。<span><br />
<br />
</span>认证要求：<span><br />
</span>一、校园类<span><br />
&nbsp;&nbsp;</span>（<span>1</span>）全日制学校在读，有学生证。<span><br />
&nbsp;&nbsp;</span>（<span>2</span>）学习导演、摄影、摄像、模特、表演、音乐、舞蹈、形象设计、服装设计、动画、视频后期等文化艺术类课程。<span><br />
</span>二、行业类<span><br />
&nbsp;&nbsp;</span>（<span>1</span>）有新浪加<span>V</span>认证的微博。<span><br />
&nbsp;&nbsp;</span>（<span>2</span>）微博认证资料与导演、摄影、摄像、模特、表演、音乐、舞蹈、形象设计、服装设计、动画、视频后期等文化艺术类行业相关。<span><br />
<br />
</span>认证方式：<span><br />
</span>一、校园类认证请提供电子版学生证照片<span><br />
</span>二、行业类认证请使用本人的新浪微博账号注册<span>/</span>绑定一起拍片网账号。&nbsp;<span></span>
            </p>
        </div>
        <p>
            <br />
        </p>
    </div>
    <if condition="count($rank_user)">
        <div style="margin: 10px 20px;line-height: 35px;vertical-align: middle;font-size: 18px;color: #959595;">您已申请过认证 【{$rank_user['rank']['title']}】<!-- <img style="display: inline-block;" class="img-responsive" title="{$rank_user['rank']['title']}" src="{$rank_user['rank']['big_logo']|get_cover='path'}"/>--> ,你可以修改并重新申请认证！</div>
    </if>
    <form class="form-horizontal ajax-form " role="form" action="{:U('Usercenter/Config/rank')}" method="post">
        <input type="hidden" name="rank_user_id" value="{$rank_user.id}">
        <div class="has-feedback">
            <div class="col-xs-12">
                <div class="form-group">
                    <label class="control-label col-xs-3" style="line-height: 35px;">认证类型
                        <ico style="line-height: 29px;">*</ico>
                    </label>

                    <div class="col-xs-9">
                        <volist name="rankList" id="vl">
                            <label class="radio-inline">
                                <input type="radio" class="rank_radios" name="rank_id" rank-title="{$vl.title}" value="{$vl.id}" style="margin-top: 11px;"
                                <eq name="vl['checked']" value="1">checked</eq>
                                > <img style="line-height: 35px;height: 35px;" class="img-responsive" title="{$vl.title}"
                                       src="{$vl.big_logo|get_cover='path'}"/>
                            </label>
                        </volist>
                    </div>
                </div>
                <div class="form-group people_text" <eq name="hide_people" value="1">style="display:none;"</eq>>
                    <label for="name" class="control-label col-xs-3">新浪微博地址
                        <ico>*</ico>
                    </label>

                    <div class="col-xs-9">
                        <div style="width: 80%;display: inline-block">
                            <input id="name" type="text" class="form-control form_check" name="name"
                                   check-type="Text" value="{$rank_user.name}" placeholder="新浪微博地址">
                        </div>
                    </div>
                </div>
                <div class="form-group campus_text" <eq name="hide_campus" value="1">style="display:none;"</eq>>
                    <label class="control-label col-xs-3">学生证编号
                        <ico>*</ico>
                    </label>

                    <div class="col-xs-9">
                        <div style="width: 80%;display: inline-block">
                            <input id="id_card" type="text" class="form-control form_check" check-type="Num"
                                   name="id_card" value="{$rank_user.id_card}" placeholder="学生证编号">
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label col-xs-3">认证说明
                        <ico>*</ico>
                    </label>

                    <div class="col-xs-9">
                        <div style="width: 80%;display: inline-block">
                            <textarea id="reason" class="form-control form_check" name="reason" check-type="Text"
                                      placeholder="说点理由吧~" style="height: 100px;">{$rank_user.reason}</textarea>
                        </div>
                    </div>
                </div>
                <div class="form-group campus_text" <eq name="hide_campus" value="1">style="display:none;"</eq>>
                    <label for="img_for" class="col-xs-3 control-label">学生证照片
                        <ico>*</ico>
                    </label>

                    <div class="col-xs-9">
                        <div style="width: 80%;display: inline-block">
                            <input type="file" id="img_for">

                            <input type="hidden" name="img" id="img" value="{$rank_user.img}"/>

                            <div class="col-sm-10 upload-img-box"
                                 style="margin-top: 10px;width: 250px;margin-left:-5px ">
                                <if condition="$rank_user['img']">
                                    <div class="upload-pre-item"><img src="{$rank_user.img|get_cover='path'}"/></div>
                                </if>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-xs-12 submit" style="text-align: center">
                <button type="submit" name="submit" class="btn btn-default button_change">确认申请</button>
            </div>
        </div>
    </form>
</div>
<style>
    .uc_config_info .form-group label {
        text-align: right;
    }

    .has-feedback .form-control {
        padding-right: 12px;
    }
</style>
<script type="text/javascript" src="__PUBLIC__/Core/js/form_check.js"></script>
<script type="text/javascript" src="__STATIC__/uploadify/jquery.uploadify.min.js"></script>
<script>
    $("#img_for").uploadify({
        "height": 30,
        "swf": "__STATIC__/uploadify/uploadify.swf",
        "fileObjName": "download",
        "buttonText": "上传电子文件",
        "buttonClass": "uploadcover",
        "uploader": "{:U('Home/File/uploadPicture',array('session_id'=>session_id()))}",
        "width": 200,
        'removeTimeout': 1,
        'fileTypeExts': '*.jpg; *.png; *.gif;',
        "onUploadSuccess": uploadPicturecover,
        'overrideEvents': ['onUploadProgress', 'onUploadComplete', 'onUploadStart', 'onSelect'],
        'onFallback': function () {
            alert('未检测到兼容版本的Flash.');
        }, 'onUploadProgress': function (file, bytesUploaded, bytesTotal, totalBytesUploaded, totalBytesTotal) {
            $("#img").parent().find('.upload-img-box').html(totalBytesUploaded + ' bytes uploaded of ' + totalBytesTotal + ' bytes.');
        }, 'onUploadComplete': function (file) {
            //alert('The file ' + file.name + ' finished processing.');
        }, 'onUploadStart': function (file) {
            $('.upload-img-box').html(
                    '<div class="upload-pre-item">上传中...</div>'
            );
            //alert('Starting to upload ' + file.name);
        }, 'onQueueComplete': function (queueData) {
            // alert(queueData.uploadsSuccessful + ' files were successfully uploaded.');
        }
    });
    function uploadPicturecover(file, data) {
        var data = $.parseJSON(data);
        var src = '';
        if (data.status) {
            $("#img").val(data.id);
            src = data.url || data.path
            $('.upload-img-box').html(
                    '<div class="upload-pre-item"><img src="' + src + '"/></div>'
            );
        } else {
            toast.error('电子文件上传失败。', '温馨提示');
        }
    }
    $(function(){
        $('.rank_radios').click(function(){
            var title=$(this).attr('rank-title');
            if(title=='行业大神认证'){
                $('.campus_text').hide();
                $('.people_text').show();
            }
            if(title=='校园大神认证'){
                $('.people_text').hide();
                $('.campus_text').show();
            }
        });
    });
</script>
</block>